<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
</html>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title></title>
		 
		<link rel="stylesheet" href="./css/reset.css">
		<link rel="stylesheet" href="./css/common.css">
		<link rel="stylesheet" href="./css/index.css">
		
		<link rel="stylesheet" href="./plugins/font-awesome-4.7.0/css/font-awesome.min.css">
	
	    <script src="./js/jquery.js" type="text/javascript" charset="utf-8"></script>
	
	    <script type="text/javascript">
	    	$(function(){
				//获取食品分类
				$.ajax({
					type:"GET",
					url:"http://192.168.150.202:8080/Api/foodTypes",
					success:function(responseData){
						 
						responseData = responseData.rows;
						var $ul = $("div.banner > ul");
						for(var i=0;i<responseData.length;i++){
							var item = responseData[i];
							var $li = $("<li id='"+item.id+"'><img src='./icon/"+item.icon+"'>"+item.name+"</li>");
						    $li.appendTo($ul);
						}
					}
				});
				
				var $advUl = $("div.adv > ul");
				var currentIndex = 0;
				//定时器
				setInterval(function() {
					//修改ul的left
					if(currentIndex==5){
						currentIndex=0;
					} 
					var leftValue = -currentIndex*100+"vw";
					$advUl.css("left",leftValue);
					currentIndex++;
				}, 1000);
				
				
				
				$("div.footer li").on("click",function(){
					//跳转
					var label = $(this).text();
					var location;
					if("首页"==label){
						location ="http://192.168.150.202:8080/Api/foodTypes";
					}else if("店铺"==label){
						location ="http://192.168.150.202:8080/Api/foodTypes";
					}else if("订单"==label){
						location ="http://192.168.150.202:8080/Api/foodTypes";
					}else{
						location ="http://192.168.150.202:8080/Api/foodTypes";
					}
					window.location.href=location;
				})
			});
	    </script>
	</head>
	<body>
		
		<div class="wrapper">
			<div class="head">
				<p><i class="fa fa-search" aria-hidden="true"></i>搜索饿了么商家、商品名称</p>
			</div>
			
			<div class="banner">
				<ul></ul>
			</div>
			
			<div class="adv">
				<ul>
					<li><img src="img/c1.jpg" alt=""></li>
					<li><img src="img/c2.jpg" alt=""></li>
					<li><img src="img/c3.jpg" alt=""></li>
					<li><img src="img/c4.jpg" alt=""></li>
					<li><img src="img/c5.jpg" alt=""></li>
				</ul>
			</div>
			
			
				<!-- 推荐商家部分 -->
				<div class="recommend">
				    <div class="recommend-line"></div>
				    <p>推荐商家</p>
				    <div class="recommend-line"></div>
				</div>
				<!-- 推荐方式部分 -->
				<ul class="recommendtype">
				    <li>综合排序<i class="fa fa-caret-down"></i></li>
				    <li>距离最近</li>
				    <li>销量最高</li>
				    <li>筛选<i class="fa fa-filter"></i></li>
				</ul>
				<!-- 推荐商家列表部分 -->
				<ul class="business">
				    <li>
				        <img src="img/b1.jpg">
				        <div class="business-info">
				            <div class="business-info-h">
				                <h3>饺子馆</h3>
				                <div class="business-info-like">&#8226;</div>
				            </div>
				            <div class="business-info-star">
				                <div class="business-info-star-left">
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <p>4.9 月售345单</p>
				                </div>
				                <div class="business-info-star-right">
				                    蜂鸟专送
				                </div>
				            </div>
				            <div class="business-info-delivery">
				                <p>&#165;15起送 | &#165;3配送</p>
				                <p>3.22km | 30分钟</p>
				            </div>
				            <div class="business-info-explain">
				                <div>各种饺子</div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">新</div>
				                    <p>饿了么新用户首单立减9元</p>
				                </div>
				                <div class="business-info-promotion-right">
				                    <p>2个活动</p>
				                    <i class="fa fa-caret-down"></i>
				                </div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon" style="background-color: #F1884F;">特</div>
				                    <p>特价商品5元起</p>
				                </div>
				            </div>
				        </div>
				    </li>
				    <li>
				        <img src="img/b2.jpg">
				        <div class="business-info">
				            <div class="business-info-h">
				                <h3>小锅饭豆腐馆（全运店）</h3>
				                <div class="business-info-like">&#8226;</div>
				            </div>
				            <div class="business-info-star">
				                <div class="business-info-star-left">
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <p>4.9 月售345单</p>
				                </div>
				                <div class="business-info-star-right">
				                    蜂鸟专送
				                </div>
				            </div>
				            <div class="business-info-delivery">
				                <p>&#165;15起送 | &#165;3配送</p>
				                <p>3.22km | 30分钟</p>
				            </div>
				            <div class="business-info-explain">
				                <div>豆腐</div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">新</div>
				                    <p>饿了么新用户首单立减9元</p>
				                </div>
				                <div class="business-info-promotion-right">
				                    <p>2个活动</p>
				                    <i class="fa fa-caret-down"></i>
				                </div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">特</div>
				                    <p>特价商品5元起</p>
				                </div>
				            </div>
				        </div>
				    </li>
				    <li>
				        <img src="img/b3.jpg">
				        <div class="business-info">
				            <div class="business-info-h">
				                <h3>麦当劳麦乐送（全运路店）</h3>
				                <div class="business-info-like">&#8226;</div>
				            </div>
				            <div class="business-info-star">
				                <div class="business-info-star-left">
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <p>4.9 月售345单</p>
				                </div>
				                <div class="business-info-star-right">
				                    蜂鸟专送
				                </div>
				            </div>
				            <div class="business-info-delivery">
				                <p>&#165;15起送 | &#165;3配送</p>
				                <p>3.22km | 30分钟</p>
				            </div>
				            <div class="business-info-explain">
				                <div>麦当劳</div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">新</div>
				                    <p>饿了么新用户首单立减9元</p>
				                </div>
				                <div class="business-info-promotion-right">
				                    <p>2个活动</p>
				                    <i class="fa fa-caret-down"></i>
				                </div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">特</div>
				                    <p>特价商品5元起</p>
				                </div>
				            </div>
				        </div>
				    </li>
				    <li>
				        <img src="img/b4.jpg">
				        <div class="business-info">
				            <div class="business-info-h">
				                <h3>米村拌饭（浑南店）</h3>
				                <div class="business-info-like">&#8226;</div>
				            </div>
				            <div class="business-info-star">
				                <div class="business-info-star-left">
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <p>4.9 月售345单</p>
				                </div>
				                <div class="business-info-star-right">
				                    蜂鸟专送
				                </div>
				            </div>
				            <div class="business-info-delivery">
				                <p>&#165;15起送 | &#165;3配送</p>
				                <p>3.22km | 30分钟</p>
				            </div>
				            <div class="business-info-explain">
				                <div>米饭</div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">新</div>
				                    <p>饿了么新用户首单立减9元</p>
				                </div>
				                <div class="business-info-promotion-right">
				                    <p>2个活动</p>
				                    <i class="fa fa-caret-down"></i>
				                </div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">特</div>
				                    <p>特价商品5元起</p>
				                </div>
				            
				        </div>
				    </li>
				    <li>
				        <img src="img/b5.jpg">
				        <div class="business-info">
				            <div class="business-info-h">
				                <h3>申记串道（中海康城店）</h3>
				                <div class="business-info-like">&#8226;</div>
				            </div>
				            <div class="business-info-star">
				                <div class="business-info-star-left">
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <i class="fa fa-star"></i>
				                    <p>4.9 月售345单</p>
				                </div>
				                <div class="business-info-star-right">
				                    蜂鸟专送
				                </div>
				            </div>
				            <div class="business-info-delivery">
				                <p>&#165;15起送 | &#165;3配送</p>
				                <p>3.22km | 30分钟</p>
				            </div>
				            <div class="business-info-explain">
				                <div>各种饺子</div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">新</div>
				                    <p>饿了么新用户首单立减9元</p>
				                </div>
				                <div class="business-info-promotion-right">
				                    <p>2个活动</p>
				                    <i class="fa fa-caret-down"></i>
				                </div>
				            </div>
				            <div class="business-info-promotion">
				                <div class="business-info-promotion-left">
				                    <div class="business-info-promotion-left-incon">特</div>
				                    <p>特价商品5元起</p>
				                </div>
				            </div>
				        </div>
				    </li>
				</ul>
				<!-- 底部菜单部分 -->
			</div>
			
			<div class="footer">
				<ul>
					<a href="index.html"><li><i class="fa fa-home"></i>首页</li></a>
					<a href="shop.html"><li><i class="fa fa-chrome"></i>店铺</li></a>
					<a href="order.html"><li><i class="fa fa-tasks"></i>订单</li></a>
					<a href="mine.html"><li><i class="fa fa-user-o"></i>我的</li></a>
				</ul>
			</div>
		</div>
	</body>
</html>
